import { defineConfig, loadEnv, normalizePath } from 'vite';
import { fileURLToPath } from 'node:url';
import autoPreFixer from 'autoprefixer';
import path from 'path';
import vitePlugins from './vite';

const config = loadEnv(process.env.NODE_ENV, process.cwd());
const resolvePath = _dir => path.resolve(__dirname, _dir);

const baseV2024Path = normalizePath(resolvePath('./src/styles/base.v2024.scss'));
const mixinPath = normalizePath(resolvePath('./src/styles/mixins.scss'));

// https://vitejs.dev/config/
export default defineConfig({
  base: './',
  external: ['vue', 'vant', 'element-plus', 'echarts'],
  plugins: vitePlugins(config),
  define: {
    'process.env': { ...config, ...process.env },
    'process.shenyun': JSON.stringify('神仙云聚集团'),
    __SERVER_NAME__: `'${config.VITE_SERVER_NAME}'`
  },
  resolve: {
    extensions: ['.mjs', '.js', '.jsx', '.ts', '.tsx', '.vue'],
    alias: {
      '@': resolvePath('src'),
      '~views': fileURLToPath(new URL('./src/views', import.meta.url)),
      'vue$': 'vue/dist/vue.common.js'
    }
  },
  css: {
    preprocessorOptions: {
      scss: {
        /* .scss全局预定义文件，引多个文件用分号; 分割 */
        additionalData: `@import "${baseV2024Path}"; @import "${mixinPath}";`
      }
    },
    modules: {
      generateScopedName: '[local]__[hash:base64:5]'
    },
    postcss: {
      plugins: [
        autoPreFixer({
          overrideBrowserslist: [
            'Android 4.1',
            'iOS 7.1',
            'Chrome > 31',
            'ff > 31',
            'ie >= 8',
            'last 10 versions'
          ],
          grid: true
        })
        /**
          * (Array) 能转化为vw的属性列表
          * 传入特定的CSS属性；
          * 可以传入通配符""去匹配所有属性，例如：['']；
          * 在属性的前或后添加"*",可以匹配特定的属性. (例如['position'] 会匹配 background-position-y)
          * 在特定属性前加 "!"，将不转换该属性的单位 . 例如: ['*', '!letter-spacing']，将不转换letter-spacing
          * "!" 和 ""可以组合使用， 例如: ['', '!font*']，将不转换font-size以及font-weight等属性
          */
        // postcssPx2Viewport({
        //   unitToConvert: 'px', // 要转化的单位
        //   viewportWidth: 1920, // UI稿适配视口宽度 375 750 1920
        //   mediaQuery: true, // 媒体查询中css代码也进行转换
        //   minPixelValue: 1, // 小于或等于1px 则不进行转换
        //   unitPrecision: 6, // 转换后的精度，即小数点位数
        //   propList: ['*', '!font-size'], // 需要转化vw属性列表，!font-size 表示font-size属性不会被转化成vw
        //   viewportUnit: 'vw', // 需转换视口单位 默认 vw
        //   fontViewportUnit: 'vw', // 需转换字体视口单位 默认 vw
        //   selectorBlackList: ['keep-px'], // 需要忽略CSS选择器，不会被转换视口单位，则继续使用原单位px  类名中含有 keep-px 都不会被转换
        //   exclude: [/node_modules/], // 忽略某些文件夹下或特定文件
        //   include: [/src/], // 只匹配某些文件夹
        //   landscapeUnit: 'vw', // 横屏单位
        //   landscape: false, // 是否处理横屏情况
        //   landscapeWidth: 1338 // 横屏视口宽度
        // })
      ]
    }
  },
  build: {
    minify: 'terser',
    target: 'modules',
    sourcemap: config.VITE_USER_NODE_ENV === 'development',
    assetsInlineLimit: 1024 * 2,
    chunkSizeWarningLimit: 1024 * 2,
    reportCompressedSize: false,
    brotliSize: false,
    terserOptions: {
      format: {
        comments: false
      },
      compress: {
        drop_console: true,
        drop_debugger: true,
        keep_infinity: true
        // pure_funcs: ['console.log'] // 移除 console
      }
    },
    outDir: resolvePath('dist'),
    rollupOptions: {
      plugins: [],
      input: {
        main: path.resolve(__dirname, 'index.html')
      },
      output: {
        manualChunks(id) {
          if (/[\\/]node_modules[\\/]/.test(id)) return 'chunk-libs';
        },
        entryFileNames: 'assets/js/[name]_[hash].js',
        chunkFileNames: 'assets/js/[name]_[hash].js',
        assetFileNames: assetInfo => {
          let info = assetInfo.name.split('.');
          let extType = info[info.length - 1];
          if (/\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/i.test(assetInfo.name)) {
            extType = 'media';
          } else if (/\.(png|jpe?g|gif|svg)(\?.*)?$/.test(assetInfo.name)) {
            extType = 'img';
          } else if (/\.(woff2?|eot|ttf|otf)(\?.*)?$/i.test(assetInfo.name)) {
            extType = 'fonts';
          }
          return `assets/${extType}/[name]_[hash][extname]`;
        }
      }
    }
  },
  server: {
    host: config.VITE_PROJECT_HOST,
    port: config.VITE_PROJECT_PORT,
    cors: true,
    open: false,
    https: false,
    hmr: true,
    css: true,
    proxy: {
      [config.VITE_BASE_API]: {
        target: config.VITE_BASE_URI,
        changeOrigin: true,
        rewrite: path => path.replace(new RegExp('^' + config.VITE_BASE_API), '')
      },
      '/api-dev': {
        target: '',
        changeOrigin: true,
        pathRewrite: { '^/api-dev': '' },
        rewrite: path => path.replace(/^\/api-dev/, '')
      }
    }
  }
});
